<template>
	<div class="add-fire-ctl-category-attr-wrap">
		<el-input v-model="searchList" auto-complete="off" placeholder="搜索"></el-input>
		<el-table
		    ref="multipleTable"
		    :data="TableData"
		    tooltip-effect="dark"
		    style="width: 100%"
		    @selection-change="handleSelectionChange">
		    <el-table-column type="selection" width="55"></el-table-column>
		    <el-table-column label="序号" type="index" width="50"></el-table-column>
            <el-table-column prop="name" label="类别名称" width="120"></el-table-column>
            <el-table-column prop="code" label="属性编码" width="120"></el-table-column>
            <el-table-column prop="unit" label="单位" width="120"></el-table-column>
            <el-table-column label="操作" width="">
            	<template slot-scope="scope">
            		<el-button @click="deletAttrRow(scope.row)" type="text" size="small">删除</el-button>
            	</template>
            </el-table-column>
        </el-table>
        <div>
        	<el-button type="primary" @click="addAttr()">新增</el-button>
        </div>
        <div class="more-btns">
             <el-button @click.stop="closeFun" round>取消</el-button>
             <el-button type="primary" @click="saveAttr()" round>确定</el-button>
        </div>
        <el-dialog
      		:close-on-click-modal="false"
            :title="dialogAttributeTitle"
            width="400px"
            top='7vh'
            v-if="dialogAttributeInfo"
            :visible.sync="dialogAttributeInfo"
            @close="closeAttributeInfo"
            append-to-body>
            <add-attribute :closeAddFun="closeAttributeInfo">
            </add-attribute>
        </el-dialog>
	</div>
</template>
<script>
import addAttribute from './addAttribute'
import { getFcfNormalP,delFcfNormalP,updateAssignFcfP } from '@/api/sysConfig'

export default{
	name:'',
	created() {
		var self = this;
		self.getTableList();
	},
	props: {
		categoryId:'',
        closeFun: {
            type: Function,
            required: true,
        },
        selectedList:''
    }, 
	components: {
		addAttribute
	},
	data() {
		return {
			attributeList:[],
			searchList:'',
			TableData:[],
			/*弹框*/
			dialogAttributeTitle:'',
			dialogAttributeInfo: false,
		}
	},
	computed: {
		TableList() {
			 let search = this.searchList;
			 if (search) {
			 	return this.TableData.filter(data => { 
			 		return Object.keys(data).some(key => {
			 			return String(data[key]).toLowerCase().indexOf(search) > -1 
			 		}); 
			 	}); 
			} 
			return this.TableData;
		}
	},
	methods: {
		handleSelectionChange(val) {
			var self = this;
			var obj = {};
			if (val.length > 0) {  // 全选
				self.attributeList = [];
				var selectList = self.selectedList;
				if(selectList.length == 1) {
					self.attributeList.push(val[0])
				} else {
					for(var i = 0; i < val.length; i++) {
						let hased = false
						for(var d = 0; d < selectList.length; d++) {
							if(val[i].name==selectList[d].name || val[i].code==selectList[d].code) {
								hased = true
								break
							}
						}
						if(!hased) {
							self.attributeList.push(val[i])
						}
					}
				}
				// if(selectList.length > 0) {
				// 	for (var i = 0; i < selectList.length; i++) {
				// 		for (var d = 0; d < val.length; d++) {
				// 			if ((val[d].name==selectList[i].name)&&(val[d].code==selectList[i].code) ) {
				// 				self.attributeList = [];
				// 			} else {
				// 				self.attributeList.push(val[d]);
				// 			}
				// 		}
				// 		selectList[i]
				// 	}
				// }
			} else { 
				self.attributeList = [];
			}
		},
		/*列表数据 */
		getTableList() {
			var self = this;
			getFcfNormalP({queryType: 0}).then(res => {
				self.TableData = res.data;
				self.$nextTick(function(){
				   self.checked();//每次更新了数据，触发这个函数即可。
                });
			});
		},
		checked() {
			var self = this;
			var selectList = self.selectedList;
			if(selectList.length > 0) {
				 selectList.forEach(i => {
				    self.$refs.multipleTable.toggleRowSelection(
				        self.TableData.find(d => 
				             (d.name === i.name)&&(d.code === i.code) ), true)  // 设置默认选中
                 });
			}
		},
		deletAttrRow(row) {
			var self = this;
			self.$confirm("确定删除该物联设备属性吗？", '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning',
                roundButton: true
            }).then(() => {
            	delFcfNormalP({id: row.id}).then(res => {
            	    if (res.status === 200) {
            	    	self.$message({
            	    		type: 'success',
                            message: '删除成功!'
                        });
                        self.getTableList();
                    } else {
                        self.$message.error(res.info);
                    }
            	});
            });
		},
		addAttr() {
			var self = this;
			self.dialogAttributeTitle = '新增物联设备属性库属性';
			self.dialogAttributeInfo = true;
		},
		closeAttributeInfo(flag) {
			var self = this;	 
			self.dialogAttributeInfo = false;
			if(flag) {
				self.getTableList();
			}
		}, 
		saveAttr() {
			var self = this;
			let params = {
				fcFacilitiesCategoryId: self.categoryId,
				properties: JSON.stringify(self.attributeList)
			};

		    updateAssignFcfP(params).then(res => {
				if(res.status === 200) {
					self.$message({
						message: '新增成功！',
						type: 'success'
					});
					self.closeFun(true);
				} else {
					self.$message({
						message: res.info,
						type: 'warning'
					});
				}
			}); 
		}
	}
}
</script>